import React from 'react';
import { Card, Flex, Button, Image } from 'antd';
import { CloseOutlined, ArrowsAltOutlined } from '@ant-design/icons';

const Home: React.FC = () => {
  const [value] = React.useState('vertical');
  return (
    <Flex className="home-page" vertical>
      <Card hoverable style={{ width: 340 }}>
        <Flex vertical={value === 'vertical'}>
          <Flex gap="small" wrap>
            <Button type="danger" icon={<CloseOutlined />}></Button>
            <Button type="cyan" icon={<ArrowsAltOutlined />}></Button>
          </Flex>
          <Image src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png" />
          <Flex gap="small" wrap>
            <div>测试数据名称测试测试</div>
            <div className=""></div>
            <Button type="danger" icon={<CloseOutlined />}></Button>
            <Button type="cyan" icon={<ArrowsAltOutlined />}></Button>
          </Flex>
        </Flex>
      </Card>
    </Flex>
  );
};

export default Home;
